import 'package:PollOnLine/utils/toast_utils.dart';
import 'package:PollOnLine/values/MyColors.dart';
import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:signature/signature.dart';

import '../../../main.dart';
import 'signature_logic.dart';

/// 签名
class SignaturePage extends StatefulWidget {
  final String title;

  const SignaturePage({Key? key, required this.title}) : super(key: key);

  @override
  State<SignaturePage> createState() => _SignaturePageState();
}

class _SignaturePageState extends State<SignaturePage> {
  final logic = Get.put(SignatureLogic());
  final state = Get.find<SignatureLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: MyColors.FFEDF1F5,
      appBar: BrnAppBar(
        title: "电子签名",
        themeData: XxxConfigUtils.defaultAppBarConfig,
      ),
      body: Container(
        margin: EdgeInsets.only(left: 32.r, right: 32.r, top: 10.r, bottom: 5.r),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(6.r),
        ),
        child: BrnShadowCard(
          color: Colors.white,
          circular: 6.r,
          spreadRadius: 0.11.r,
          blurRadius: 0.4.r,
          child: Stack(
            children: [
              Center(
                child: Text("在此处签名", style: TextStyle(fontSize: 38.sp, color: const Color(0x06000000))),
              ),
              Signature(
                key: const Key('signature'),
                controller: logic.controller,
                height: Get.height - 128,
                backgroundColor: Colors.transparent,
              ),
            ],
          ),
        ),
      ),
      bottomNavigationBar: SafeArea(
        child: Container(
          margin: EdgeInsets.only(left: 32.r, right: 32.r, bottom: 0.r),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              //SHOW EXPORTED IMAGE IN NEW ROUTE
              // IconButton(
              //   key: const Key('exportPNG'),
              //   icon: const Icon(Icons.image),
              //   color: Colors.white,
              //   onPressed: () => logic.exportImage(context),
              //   tooltip: 'Export Image',
              // ),
              // IconButton(
              //   key: const Key('exportSVG'),
              //   icon: const Icon(Icons.share),
              //   color: Colors.blue,
              //   onPressed: () => logic.exportSVG(context),
              //   tooltip: 'Export SVG',
              // ),
              // IconButton(
              //   icon: const Icon(Icons.undo),
              //   color: Colors.white,
              //   onPressed: () {
              //     setState(() => logic.controller.undo());
              //   },
              //   tooltip: 'Undo',
              // ),
              // IconButton(
              //   icon: const Icon(Icons.redo),
              //   color: Colors.white,
              //   onPressed: () {
              //     setState(() => logic.controller.redo());
              //   },
              //   tooltip: 'Redo',
              // ),
              //CLEAR CANVAS
              // IconButton(
              //   key: const Key('clear'),
              //   icon: const Icon(Icons.clear),
              //   color: Colors.white,
              //   onPressed: () {
              //     setState(() => logic.controller.clear());
              //   },
              //   tooltip: 'Clear',
              // ),
              OutlinedButton(
                style: OutlinedButton.styleFrom(
                  padding: EdgeInsets.only(left: 32.r, right: 32.r, top: 0.r, bottom: 0.r),
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6.r)),
                  side: const BorderSide(color: MyColors.FF1060DD),
                  minimumSize: Size(300.r, 72.r),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    const Icon(Icons.refresh, color: MyColors.FF1060DD, size: 20),
                    Padding(padding: EdgeInsets.all(10.r), child: Text("重签", style: TextStyle(color: MyColors.FF1060DD, fontSize: 24.r)))
                  ],
                ),
                onPressed: () {
                  setState(() => logic.controller.clear());
                },
              ),
              // STOP Edit
              ElevatedButton(
                style: ElevatedButton.styleFrom(
                  padding: EdgeInsets.only(left: 32.r, right: 32.r, top: 0.r, bottom: 0.r),
                  backgroundColor: MyColors.FF0144B0,
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6.r)),
                  minimumSize: Size(300.r, 72.r),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    const Icon(Icons.check, color: Colors.white, size: 20),
                    Padding(padding: EdgeInsets.all(10.r), child: Text("确认", style: TextStyle(color: Colors.white, fontSize: 24.r)))
                  ],
                ),
                onPressed: () {
                  setState(() => logic.controller.disabled = !logic.controller.disabled);
                  if (logic.controller.disabled) {
                    logic.uploadFile();
                  } else {
                    toast.show("取消");
                  }
                },
              ),
              // IconButton(
              //   key: const Key('stop'),
              //   icon: Icon(
              //     logic.controller.disabled ? Icons.pause : Icons.play_arrow,
              //   ),
              //   color: Colors.white,
              //   onPressed: () {
              //     setState(() => logic.controller.disabled = !logic.controller.disabled);
              //     if (logic.controller.disabled) {
              //       BrnToast.show("保存成功", context);
              //       Get.back();
              //     } else {
              //       BrnToast.show("取消", context);
              //     }
              //   },
              //   tooltip: logic.controller.disabled ? 'Pause' : 'Play',
              // ),
            ],
          ),
        ),
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<SignatureLogic>();
    super.dispose();
  }
}
